<script type="text/javascript">
$(function(){
	var pg = App.soagov.svcIndex.ui, pp = pg.params
		, id = pp? pp.key : App.getHashParam('id')
		, frm = pg.find('.form')
		, tabs = pg.find('.tabs')
		, infoPl = pg.find('.infoPl')
		, byMePl = pg.find('.byMePl')
		, byMeGd = pg.seek('byMeGd')
		, onMePl = pg.find('.onMePl')
		, onMeGd = pg.seek('onMeGd')
		, facesPl = pg.find('.facesPl')
		, facesGd = pg.seek('facesGd')
		, thumbPl = pg.find('.thumbPl')
		, thumb = pg.find(".thumb")
		, appId =  pp.parent;

	function init(fo, by, on, fc) {
		byMeGd.mac('grid', {
			cols : [{
				field: 'code', title : '组件编号', width: 140,
				render: function(r){
					return r.objCode1;
				}
			},{
				field: 'name', title : '组件名称', width: 160,
				render: function(r){
					return r.objName1;
				}
			},{
				field: 'ver', title : '组件版本', width: 80,
				render: function(r){
					return r.objVer1;
				}
			},{
				field: 'async', title : '异步', width: 40,
				render: function(r){
					return r.async? '是':'否';
				}
			},{
				field: 'way', title : '方式', width: 120
			},{
				field: 'memo', title : '备注', width: 200
			}],
			pagerLength: 10
		});
	
		onMeGd.mac('grid', {
			cols : [{
				field: 'code', title : '组件编号', width: 140,
				render: function(r){
					return r.objCode0;
				}
			},{
				field: 'name', title : '组件名称', width: 160,
				render: function(r){
					return r.objName0;
				}
			},{
				field: 'ver', title : '组件版本', width: 80,
				render: function(r){
					return r.objVer0;
				}
			},{
				field: 'async', title : '异步', width: 40,
				render: function(r){
					return r.async? '是':'否';
				}
			},{
				field: 'way', title : '方式', width: 120
			},{
				field: 'memo', title : '备注', width: 200
			}],
			pagerLength: 10
		});
		
		facesGd.mac('grid', {
			cols : [{
				field: 'code', title : '接口编号', width: 140
			},{
				field: 'name', title : '接口名称', width: 140
			},{
				field: 'face', title : '接口定义', width: 140
			},{
				field: 'entry', title : '入口方法', width: 140
			},{
				field: 'ver', title : '版本', width: 80
			},{
				field: 'status', title : '状态', width: 80,
				render: function(r) {
					return Cache.base.face.status[r.status];
				}
			},{
				field: 'memo', title : '备注', width: 200
			}]
		});
	
		thumb.mousewheel(function(e, delta, deltaX, deltaY){
			thumb.width(thumb.width() * (delta>0 ? 1.1:0.9));
			return false;
		});
		
		tabs.mac('tabs', {
			tabWidth: 80,
			tabHeight: 32,
			items: [{
				code: 'infoPl',
				title: '基本信息',
				el: infoPl
			},{
				code: 'thumbPl',
				title: '流程预览',
				el: thumb
			},{
				code: 'byMePl',
				title: '依赖项',
				el: byMePl
			},{
				code: 'onMePl',
				title: '被依赖项',
				el: onMePl
			},{
				code: 'facesPl', title: '涉及接口',
				el: facesPl
			},{
				code: 'instPl', title: '实例监控',
	// 			auth: 'svc.inst.list',
				render: function(p, c) {
					App.show({
						ctx: 'soagov',
						action: 'svcInstIndex',
						params: fo
					}, $.noop, p);
				}
			},{
				code: 'tracePl', title: '调用链',
	// 			auth: 'svc.inst.list',
				render: function(p, c) {
					fo.app = pp.app;
					App.show({
						ctx: 'soagov',
						action: 'svcTraceIndex',
						params: fo
					}, $.noop, p);
				}
			}]
		}).selectFirst();
			
		frm.seek('code').text(fo.code);
		frm.seek('flow').click(function(){
			var r = fo, f = pg.find('form');
			f.seek('id').val(r.id);
			f.seek('code').val(r.code);
			f.seek('name').val(r.name);
			f.seek('appId').val(r.appId);
			f.seek('ver').val(r.ver);
			f.seek('path').val(r.path);
			f.seek('url').val(App.soagov.ctx + '/#flow/edit?catalog=svc&id='
				+ r.id + '&code=' + r.code);
			f[0].submit();
		});
		frm.seek('name').text(fo.name);
		frm.seek('faceId').val(fo.faceId);
		if (fo.face) {
			frm.seek('faceCode').click(function(){
				App.open({
					ctx: 'soagov',
					action: 'faceView',
					params: { id: fo.faceId, box: 1 }
				});
			}).text(fo.face.code);
			frm.seek('faceName').text(fo.face.name);
		}
		frm.seek('url').text(fo.url);
		frm.seek('entry').val(fo.name);
		frm.seek('impl').text(fo.impl);
		frm.seek('ver').text(fo.ver);
		frm.seek('memo').text(fo.memo);
		//frm.seek('owner').text(fo.owner);
		frm.seek('status').text(Cache.base.svc.status[fo.status]);
		var op = $('<span class="a"></span>');
		if (fo.status == 0) {
			op.click(function(){
				
			}).append('启用');
		} else {
			op.click(function(){
				
			}).append('停用');
		}
		frm.seek('opt').append(op);
		frm.seek('path').text(fo.path);
		frm.seek('memo').text(fo.memo);
		//
		byMeGd.loadData($.map(by, function(v, k){
			return k != '0'? v:null;
		}));
		onMeGd.loadData($.map(on, function(v, k){
			return k != '0'? v:null;
		}));
		facesGd.loadData($.map(fc, function(v, k){
			return k != '0'? v:null;
		}));
		
		function adjust(){
			var p = pg.parent(), h = pg.parent().height() - 16;
			pg.height(h);
			tabs.height(h);
			tabs.width(p.width() - 16);
			tabs.adjust();
			h = tabs.children('.body').height();
			onMeGd.parent().height(h - 64);
			onMeGd.adjust();
			byMeGd.parent().height(h - 64);
			byMeGd.adjust();
			facesGd.parent().height(h - 64);
			facesGd.adjust();
		}
		$(window).resize(adjust);
		adjust(); 
	}

	var w = mac.wait('Loading');
	$.get(App.soagov.ctx + '/svc/get.do', {
		id: id
	}, function(rs) {
		w.close();
		var ro = mac.eval(rs);
		if (ro.success) {
			init(ro.data, ro.byMe, ro.onMe, ro.faces);
		} else {
			mac.alert(ro.data, ro.params);
		}
	});
	
	$.get(App.soagov.ctx + '/flow/thumb.do', {
		id: id,
		url: true
	}, function(rs) {
		var ro = mac.eval(rs);
		if (ro.success) {
			thumb.prop('src', ro.data);
		} else {
			thumb.prop('alt', ro.params);
			//mac.alert(ro.data, ro.params);
		}
	});
});
</script>
<div class="tabs"></div>
<div class="infoPl">
	<form method="post" action="/soagov/flow/edit.do" target="_blank">
		<input type="hidden" name="id" />
		<input type="hidden" name="code" />
		<input type="hidden" name="name" />
		<input type="hidden" name="type" value="0" />
		<input type="hidden" name="catalog" value="soagov" />
		<input type="hidden" name="appId" />
		<input type="hidden" name="url" />
		<input type="hidden" name="ver" />
		<input type="hidden" name="path" />
	</form>
	<div class="form">
		<div class="item">
			<span class="label">英文名：</span>
			<span class="value" name="code"></span>
		</div>
		<div class="item">
			<span class="label">&nbsp;</span>
			<span class="value a" name="flow">编辑流程</span>
		</div>
		<div class="item">
			<span class="label">中文名：</span> <span class="value" name="name"></span>
		</div>
		<div class="item">
			<span class="label">接口编号：</span> <span class="value a"
				name="faceCode"></span>
		</div>
		<div class="item">
			<span class="label">接口中文名：</span> <span class="value" name="faceName"></span>
		</div>
		<div class="item">
			<span class="label">URL：</span>
			<textarea name="url" readonly></textarea>
		</div>
		<div class="item">
			<span class="label">入口：</span>
			<span class="value" name="entry"></span>
		</div>
		<div class="item">
			<span class="label">实现：</span> <span class="value" name="impl"></span>
		</div>
		<div class="item">
			<span class="label">版本：</span> <span class="value" name="ver"></span>
		</div>
		<div class="item">
			<span class="label">状态：</span> <span class="value" name="status"></span>
		</div>
		<div class="item">
			<span class="label">操作：</span> <span class="value" name="opt"></span>
		</div>
		<div class="item">
			<span class="label">导出目录：</span> <span class="value" name="path"></span>
		</div>
		<div class="item">
			<span class="label">描述：</span> <span class="memo" name="memo"></span>
		</div>
	</div>
</div>
<div class="byMePl">
	<div class="head">当前流程务依赖以下组件或服务</div>
	<div class="body">
		<div class="grid" name="byMeGd"></div>
	</div>
</div>
<div class="onMePl">
	<div class="head">当前流程被以下对象组件或服务依赖</div>
	<div class="body">
		<div class="grid" name="onMeGd"></div>
	</div>
</div>
<div class="facesPl">
	<div class="head">当前流程涉及以下接口</div>
	<div class="body">
		<div class="grid" name="facesGd"></div>
	</div>
</div>
<img class="thumb" src="img/none.png" alt="暂无图片" />
